<template>
	<view class="page">
		<view class="myDivide">
			<view class="txt">
				<view>我的积分</view>
				<view>{{ disScore }}</view>
			</view>
			<view><button @click="gotoRouter('/pages-member/divideLogs/divideLogs')">积分记录</button></view>
		</view>

		<view>
			<view class="tetle">积分兑换 <span>（如需兑换请联系客服，暂不支持线上兑换）</span></view>
			<view class="goods_list">
				<view class="goods_card" v-for="item in records" :key="item.id">
					<view>
						<image mode="heightFix" :src="item.thumbnailUrl" />
					</view>
					<view>{{ item.name }}</view>
					<view>{{ item.needIntegral }}积分</view>
					<view class="exchanging">
						<view>{{ item.exchangeCount }}人已兑换</view>
						<view><button @click="eject = true">兑换</button></view>
					</view>
				</view>
			</view>
		</view>

		<view class="eject_window" v-if="eject">
			<view>
				<view>兑换说明</view>
				<view>请联系客服进行兑换</view>
				<view><button @click="eject_off">我知道了</button></view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			disScore: 0,
			pageNo: 1,
			total: 0,
			records: [],
			eject:false
		}
	},
	onShow() {
		this.records = []
		this.pageNo = 1
		this.getMyIntegral()
		this.getIntegralGoodsList()
	},
	onReachBottom() {
		if (this.pageNo * 10 < this.total) {
			this.pageNo++
			this.getIntegralGoodsList()
		}
	},
	methods: {
		// 我的积分
		getMyIntegral() {
			this.$api.getMyIntegral().then(e => {
				const { code, result: { disScore } } = e
				if (code == 200) {
					this.disScore = disScore
				} else {
					uni.showToast({
						title: e.message,
						icon: 'none'
					});
				}
			})
		},
		getIntegralGoodsList() {
			this.$api.getIntegralGoodsList({
				enabled: 1,
				pageNo: 1,
				pageSize: 10,
			}).then(e => {
				const { code, result: { records, total } } = e
				if (code == 200) {
					this.records.push.apply(this.records, records)
					this.total = total
				} else {
					uni.showToast({
						title: e.message,
						icon: 'none'
					});
				}
			})
		},
		eject_off(){
			this.eject = false
		}

	}
}
</script>

<style lang="less" scoped>
@import './myDivide.less';
</style>
